<template>
  <bsCard class="profit-wrapper" :width="getBsLRWPercent(200)" height="320px">
    <div class="icon-title income">营业收入({{ operateIncomeFormat.unit }})</div>
    <div class="icon-title-val">{{ operateIncomeFormat.val }}</div>
    <div class="icon-title profit">利润({{profitFormat.unit}})</div>
    <div class="icon-title-val">{{ profitFormat.val }}</div>
  </bsCard>
</template>

<script>
import '../styles/index.scss'
import bsCard from './bsCard.vue'
import { moneyFormat } from './tools'
export default {
  name: 'profit',
  components: {
    bsCard
  },
  inject: ['getBsLRWPercent'],
  props: {
    enterpriseOverview: {
      type: Object,
      default: function() {
        return {
          operateIncome: '0',
          profit: '0'
        }
      }
    }
  },
  data() {
    return {}
  },
  computed: {
    operateIncomeFormat() {
      return moneyFormat(this.enterpriseOverview.operateIncome)
    },
    profitFormat() {
      return moneyFormat(this.enterpriseOverview.profit)
    }
  },
  methods: {

  }
}
</script>

<style lang='scss'>
.profit-wrapper {
  .bs-card-content {
    display: flex;
    flex-flow: column;
    justify-content: space-around;
    padding-right: 0;
    padding-left: 0;
  }

  .icon-title.income {
    margin-left: 15px;
    &::before {
      background-image: url('../assets/business.png');
    }
  }
  .icon-title.profit {
    margin-left: 15px;
    &::before {
      background-image: url('../assets/income.png');
    }
  }
}
</style>
